<div class="panel panel-default panel-intro">
    <div class="panel-heading">
        <ul class="nav nav-tabs">
            <li class="active"><a href="#t-optimize" data-toggle="tab">智能排程优化</a></li>
            <li><a href="#t-suggestions" data-toggle="tab">优化建议</a></li>
        </ul>
    </div>
    <div class="panel-body">
        <div class="tab-content">
            <!-- 智能排程优化 -->
            <div class="tab-pane fade active in" id="t-optimize">
                <div class="row">
                    <div class="col-md-8">
                        <form id="optimize-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
                            <div class="form-group">
                                <label class="control-label col-xs-12 col-sm-2">排程算法:</label>
                                <div class="col-xs-12 col-sm-8">
                                    <select class="form-control" name="algorithm" data-rule="required">
                                        {volist name="algorithms" id="algorithm" key="key"}
                                        <option value="{$key}">{$algorithm}</option>
                                        {/volist}
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-xs-12 col-sm-2">约束条件:</label>
                                <div class="col-xs-12 col-sm-8">
                                    <div class="checkbox">
                                        <label>
                                            <input type="checkbox" name="constraints[]" value="equipment_capacity" checked> 设备产能限制
                                        </label>
                                    </div>
                                    <div class="checkbox">
                                        <label>
                                            <input type="checkbox" name="constraints[]" value="employee_skill" checked> 员工技能匹配
                                        </label>
                                    </div>
                                    <div class="checkbox">
                                        <label>
                                            <input type="checkbox" name="constraints[]" value="material_availability" checked> 物料可用性
                                        </label>
                                    </div>
                                    <div class="checkbox">
                                        <label>
                                            <input type="checkbox" name="constraints[]" value="delivery_date" checked> 交货期约束
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-xs-12 col-sm-2">优化目标:</label>
                                <div class="col-xs-12 col-sm-8">
                                    <div class="radio">
                                        <label>
                                            <input type="radio" name="objective" value="minimize_makespan" checked> 最小化完工时间
                                        </label>
                                    </div>
                                    <div class="radio">
                                        <label>
                                            <input type="radio" name="objective" value="maximize_utilization"> 最大化设备利用率
                                        </label>
                                    </div>
                                    <div class="radio">
                                        <label>
                                            <input type="radio" name="objective" value="minimize_setup"> 最小化换模时间
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group layer-footer">
                                <label class="control-label col-xs-12 col-sm-2"></label>
                                <div class="col-xs-12 col-sm-8">
                                    <button type="submit" class="btn btn-success btn-embossed">开始优化</button>
                                    <button type="button" class="btn btn-default btn-embossed" onclick="getSuggestions()">获取建议</button>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="col-md-4">
                        <div class="panel panel-info">
                            <div class="panel-heading">
                                <h4 class="panel-title">算法说明</h4>
                            </div>
                            <div class="panel-body">
                                <div id="algorithm-description">
                                    <h5>优先级排程</h5>
                                    <p>根据任务优先级、交货期等因素进行排程，适用于大多数生产场景。</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 优化建议 -->
            <div class="tab-pane fade" id="t-suggestions">
                <div class="row">
                    <div class="col-md-12">
                        <div id="suggestions-container">
                            <div class="alert alert-info">
                                <i class="fa fa-info-circle"></i> 点击"获取建议"按钮查看当前排程的优化建议
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
$(document).ready(function() {
    // 算法选择变化时更新说明
    $('select[name="algorithm"]').change(function() {
        var algorithm = $(this).val();
        var descriptions = {
            'priority': {
                title: '优先级排程',
                desc: '根据任务优先级、交货期等因素进行排程，适用于大多数生产场景。'
            },
            'finite_capacity': {
                title: '有限产能排程',
                desc: '考虑设备实际产能限制，确保排程方案的可行性。'
            },
            'cyclic': {
                title: '循环排程',
                desc: '适用于重复性生产，优化生产周期和资源利用。'
            }
        };
        
        if (descriptions[algorithm]) {
            $('#algorithm-description').html(
                '<h5>' + descriptions[algorithm].title + '</h5>' +
                '<p>' + descriptions[algorithm].desc + '</p>'
            );
        }
    });
    
    // 表单提交
    $('#optimize-form').on('submit', function(e) {
        e.preventDefault();
        
        var formData = $(this).serialize();
        
        $.post('', formData, function(data) {
            if (data.code === 1) {
                Toastr.success('排程优化完成');
                // 可以在这里显示优化结果
            } else {
                Toastr.error(data.msg || '优化失败');
            }
        }, 'json');
    });
});

// 获取优化建议
function getSuggestions() {
    $.get('getSuggestions', function(data) {
        if (data.code === 1) {
            displaySuggestions(data.data);
        } else {
            Toastr.error(data.msg || '获取建议失败');
        }
    }, 'json');
}

// 显示建议
function displaySuggestions(suggestions) {
    var html = '';
    
    if (suggestions.length === 0) {
        html = '<div class="alert alert-success"><i class="fa fa-check-circle"></i> 当前排程状态良好，无需优化</div>';
    } else {
        suggestions.forEach(function(suggestion) {
            var alertClass = 'alert-info';
            var icon = 'fa-info-circle';
            
            if (suggestion.type === 'warning') {
                alertClass = 'alert-warning';
                icon = 'fa-exclamation-triangle';
            } else if (suggestion.type === 'error') {
                alertClass = 'alert-danger';
                icon = 'fa-times-circle';
            }
            
            html += '<div class="alert ' + alertClass + '">' +
                   '<i class="fa ' + icon + '"></i> ' +
                   '<strong>' + suggestion.title + '</strong><br>' +
                   suggestion.message +
                   '</div>';
        });
    }
    
    $('#suggestions-container').html(html);
    
    // 切换到建议标签页
    $('a[href="#t-suggestions"]').tab('show');
}
</script>
